<!--
  系统主页界面
-->
<template>
      <el-container>
        <el-header height="100px">
          <el-row style="margin-top:20px">
            <el-col :span=9>
              <span style="font-family: 华文隶书; font-size: xx-large; font-weight: bolder">
                <i class="el-icon-help"></i>
                工会困难职工帮扶救助管理系统
              </span>
            </el-col>
            <el-col :span=2 :push=9>
              <el-link v-if=!$store.state.login_status href="#/login" type="primary" icon="el-icon-user">用户登录</el-link>
            </el-col>
            <el-col :span=2 :push=9>
              <el-link v-if=!$store.state.login_status href="#/register" type="primary" icon="el-icon-user-solid">用户注册</el-link>
            </el-col>
            <el-col :span=2 :push=9 v-if=!$store.state.login_status>
              <el-link href="#/login_admin" type="primary" icon="el-icon-s-custom">管理员登录</el-link>
            </el-col>
            <el-col :span=2 :push=12>
              <el-dropdown v-if=$store.state.login_status>
                <span class="el-dropdown-link">{{ $store.state.id }}<i class="el-icon-arrow-down el-icon--right"></i></span>
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item v-if="!$store.state.admin_status">
                    <el-link href="#/index/worker/message">消息</el-link>
                  </el-dropdown-item>
                  <el-dropdown-item>
                    <el-link @click="logout">退出</el-link>
                  </el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>
            </el-col>
          </el-row>
        </el-header>
          <el-main>
            <h1 v-if=!$store.state.login_status style="margin: 120px">欢迎进入中国石油大学（北京）工会职工帮扶救助管理系统</h1>
            <router-view></router-view>
          </el-main>
      </el-container>
</template>

<script>
import instance from "../utils/request";

export default {
  name: "Index",
  data(){
    return {

    }
  },
  methods:{
    /*
      登出方法
      退出登录执行过程：
          修改登录状态
          返回系统主页
     */
    logout(){
      this.$store.commit('changeLogin_Status');
      this.$router.push('/index');
    }
  }
}
</script>

<style scoped>


.el-header{
  background-color: #FFFFFF;
  color: #333;
  text-align: center;
  line-height: 60px;
}

.el-main {
  background-color: #E9EEF3;
  color: #333;
  text-align: center;
  /*line-height: 160px;*/
  padding: 2px;
}

body > .el-container {
  margin-bottom: 20px;
}

.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
  line-height: 260px;
}

.el-container:nth-child(7) .el-aside {
  line-height: 320px;
}
.el-dropdown-link {
  cursor: pointer;
  color: #409EFF;
}
.el-icon-arrow-down {
  font-size: 12px;
}
</style>
